function setUpBusList(){
	var bussesList =Ext.StoreMgr.lookup("Busses").data.items;
	listBusPanel =  new Ext.Panel({
		 
    });
	addBussesToPanel( bussesList);

}
function addBus(bus){ 
	 
	listBusPanel.add({
		xtype: 'togglefield',
		height: 53,
		padding: '0 0 0 0',
		name: bus.id ,
       label:"Bus nr. "+bus.bus ,
       listeners: { 
           change: function (slider, thumb, newValue, oldValue) {
        	   
        	   var nextBtn = obj.application.viewport.query('#nextBtn')[0];
       	    
               if (oldValue == 0 && newValue == 1) {
            	    selectedBusses.push( slider.getName() );  
            	    nextBtn.show();
            	   // Changing from off to on...do something?
               }
               else if (oldValue == 1 && newValue == 0){
                   // Changing from on to off...do something?
            	  var idx = selectedBusses.indexOf(slider.getName()); // Find the index
            	 
            	  if(idx!=-1) selectedBusses.splice(idx, 1); // removes the object from index idx 
            	  if(selectedBusses.length==0)nextBtn.hide();
               }
           }
       }
    }); 
};
	
 function addBussesToPanel(  busses){
		  for(var i=0; i<busses.length ;i++){
			  addBus(busses[i].data);
			  listBusPanel.setScrollable('vertical');
			  listBusPanel.doLayout();
		  }
		   
	  }

Ext.regController('Busses',{
	/// gets the busses based on the buss station selected
	show: function(){
		 obj = this;
		
		//sets title
		setTitle(this,"Busses:"); 
		//set up the list of busses panel
		
		
		
    	//set up navigation
		//back button - ctrl: Map,action: stations
    	var backBtn = this.application.viewport.query('#backBtn')[0];
  	    backBtn.show();
  	    backBtn.setHandler(function()
				{
  	    		backBtn.show();
  		  		Ext.dispatch({
  		  					 controller: 'Map',
  		  					 action: 'stationsOld',
  		  					 historyUrl: 'Map/stationsOld', 
  		  					 //
  		  					 animation: {
				             type: 'slide',
				             reverse: true,
				         },
				    });
				});
  	    
  	    //next buton: ctr:Time,action:show
  	    var nextBtn = this.application.viewport.query('#nextBtn')[0];
	    nextBtn.hide();
	    nextBtn.setHandler(function()
				{
 		  		Ext.dispatch({
 		  					controller: 'Time',
 		  					 action: 'show',
 		  					 historyUrl: 'Time/show', 
 		  					 
				          });
				});
	    
	    
	    
	    
	    //set up the view
    	if(!this.bussesList)
    		{
    			this.bussesList = this.render({
    				xtype:'BussesList',
    			});
    		}
    	
	    this.application.viewport.setActiveItem(this.bussesList );
	  
},

	show2: function(){
		setTitle(this,"Busses:"); 
		//set up navigation
		//back button - ctrl: Map,action: stations
    	var backBtn = this.application.viewport.query('#backBtn')[0];
  	    backBtn.show();
  	    backBtn.setHandler(function()
				{
  	    		backBtn.show();
  		  		Ext.dispatch({
  		  					 controller: 'Map',
  		  					 action: 'stationsOld',
  		  					 historyUrl: 'Map/stationsOld', 
  		  					 //
  		  					 animation: {
				             type: 'slide',
				             reverse: true,
				         },
				    });
				});
  	    
  	    //next buton: ctr:Time,action:show
  	    var nextBtn = this.application.viewport.query('#nextBtn')[0];
	    nextBtn.hide();
	    nextBtn.setHandler(function()
				{
 		  		Ext.dispatch({
 		  					controller: 'Time',
 		  					 action: 'show',
 		  					 historyUrl: 'Time/show', 
 		  					 
				          });
				});
		if(!this.bussesList)
		{
			this.bussesList = this.render({
				xtype:'BussesList',
			});
		}
	
	    this.application.viewport.setActiveItem(this.bussesList );
	    Ext.dispatch({
				controller: 'Time',
				 action: 'show',
				 historyUrl: 'Time/show', 
				 
	      });
	}
});